<template>
  <div class="tt">
      <div v-for='item in reyinglist' class='haha' :key='item.id'> 
          <router-link :to="'/item/'+item.id">
                            <img :src="item.img" alt="">
                            <div class='aa'>
                                <div class='qq'>{{item.nm}}</div>
                                <div class='ww'>观众评：{{item.sc}}</div>
                                <div class='ww'>主演：{{item.star}}</div>
                                <div class='ww'>{{item.showInfo}}</div>
                                
                            </div>
                            <button>购票</button>
          </router-link>
     </div>
  </div>
</template>

<script>
export default {
    name:'reying',
    props: ['reyinglist']
}
</script>

<style scoped>
 .haha{
            display: flex;
            margin-bottom: .533333rem;
            align-items: center;
            margin-left: .8rem;
            
            
        }
.haha img{
    width: auto;
    height: 80px;
    margin-top: .8rem;
}
  .qq{
            font-size: 15px;
        }
        .ww{
            color: #666;
        }
 button{
            background-color: red;
            color: white;
            width: 2.666667rem;
            height: 1.333333rem;
            border: none;
            margin-left: .533333rem;
            
        }
        .aa{
            margin-left: 10px;
            overflow: hidden;
            text-overflow: ellipsis; 
            white-space: nowrap;
            margin-bottom: .266667rem;
            font-size: 14px;
            width: 13.333333rem;
            height: 5.333333rem;
        }
.tt .haha a{
    display: flex;
    justify-content: space-around;
    color: #333;
    align-items: center;
}


</style>